<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>求职者端管理</title>
    <link rel="stylesheet" href="css/style.css">
    <style>
        /* 求职者页面特定样式 */
        .sidebar {
            width: 200px;
            height: 100vh;
            background-color: var(--seeker-primary);
            color: white;
            position: fixed;
            top: 0;
            left: 0;
        }
        .sidebar ul {
            list-style-type: none;
            padding: 0;
        }
        .sidebar li {
            padding: 15px;
            cursor: pointer;
        }
        .sidebar li:hover {
            background-color: var(--seeker-secondary);
        }
        .main-content {
            margin-left: 200px;
            padding: 20px;
        }
        .tab-content {
            display: none;
        }
        .tab-content.active {
            display: block;
        }
        .form-group {
            margin-bottom: 15px;
        }
        .form-group label {
            display: block;
            margin-bottom: 5px;
        }
        .form-group input,
        .form-group textarea {
            width: 100%;
            padding: 8px;
            border: 1px solid #ddd;
            border-radius: 4px;
            box-sizing: border-box;
        }
        .submit-btn {
            padding: 10px 15px;
            background-color: var(--seeker-primary);
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            transition: background-color 0.3s;
        }
        .submit-btn:hover {
            background-color: var(--seeker-secondary);
        }
        .search-box {
            margin-bottom: 20px;
        }
        .search-box input {
            padding: 8px;
            width: 300px;
            border: 1px solid #ddd;
            border-radius: 4px;
        }
        .search-box button {
            padding: 8px 15px;
            background-color: var(--seeker-primary);
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            transition: background-color 0.3s;
        }
        .search-box button:hover {
            background-color: var(--seeker-secondary);
        }
        table {
            width: 100%;
            border-collapse: collapse;
        }
        th, td {
            border: 1px solid #ddd;
            padding: 8px;
            text-align: left;
        }
        th {
            background-color: #f2f2f2;
        }
        .filter-group {
            margin-bottom: 15px;
        }
        .filter-group select {
            padding: 8px;
            border: 1px solid #ddd;
            border-radius: 4px;
        }
        .update-record {
            cursor: pointer;
            color: #3498db;
            margin: 5px 0;
        }
        .update-detail {
            display: none;
            padding: 10px;
            border: 1px solid #ddd;
            border-radius: 4px;
            margin: 5px 0;
            background-color: #f9f9f9;
        }
    </style>
</head>
<body>
    <div class="sidebar">
        <ul>
            <li onclick="showTab('personal-info')">个人信息/简历管理</li>
            <li onclick="showTab('job-search')">职位浏览</li>
            <li onclick="showTab('application-record')">投递记录/进度查询</li>
            <li onclick="showTab('interview-notice')">面试通知</li>
            <li onclick="showTab('my-resume')">我的简历</li>
        </ul>
    </div>
    <div class="main-content">
        <!-- 个人信息/简历管理 -->
        <div id="personal-info" class="tab-content active">
            <h2>个人信息/简历管理</h2>
            <form>
                <div class="form-group">
                    <label for="name">姓名</label>
                    <input type="text" id="name" name="name" required>
                </div>
                <div class="form-group">
                    <label for="gender">性别</label>
                    <select id="gender" name="gender" required>
                        <option value="">请选择性别</option>
                        <option value="male">男</option>
                        <option value="female">女</option>
                        <option value="other">其他</option>
                    </select>
                </div>
                <div class="form-group">
                    <label for="birthdate">出生日期</label>
                    <input type="date" id="birthdate" name="birthdate">
                </div>
                <div class="form-group">
                    <label for="phone">手机号</label>
                    <input type="tel" id="phone" name="phone" required>
                </div>
                <div class="form-group">
                    <label for="email">邮箱</label>
                    <input type="email" id="email" name="email" required>
                </div>
                <div class="form-group">
                    <label for="education">最高学历</label>
                    <select id="education" name="education" required>
                        <option value="">请选择学历</option>
                        <option value="highschool">高中及以下</option>
                        <option value="college">大专</option>
                        <option value="bachelor">本科</option>
                        <option value="master">硕士</option>
                        <option value="doctor">博士及以上</option>
                    </select>
                </div>
                <div class="form-group">
                    <label for="major">专业</label>
                    <input type="text" id="major" name="major" placeholder="例如：计算机科学与技术">
                </div>
                <div class="form-group">
                    <label for="school">毕业院校</label>
                    <input type="text" id="school" name="school" placeholder="例如：北京大学">
                </div>
                <div class="form-group">
                    <label for="graduation-date">毕业时间</label>
                    <input type="month" id="graduation-date" name="graduation-date">
                </div>
                <div class="form-group">
                    <label for="work-experience">工作经验</label>
                    <select id="work-experience" name="work-experience" required>
                        <option value="">请选择工作经验</option>
                        <option value="fresh">应届毕业生</option>
                        <option value="1year">1年以内</option>
                        <option value="1-3year">1-3年</option>
                        <option value="3-5year">3-5年</option>
                        <option value="5year+">5年以上</option>
                    </select>
                </div>
                <div class="form-group">
                    <label for="resume-title">简历标题</label>
                    <input type="text" id="resume-title" name="resume-title" placeholder="例如：3年经验前端开发工程师">
                </div>
                <div class="form-group">
                    <label for="resume-content">个人简介</label>
                    <textarea id="resume-content" name="resume-content" rows="4" placeholder="请简要介绍您的专业技能和工作经历"></textarea>
                </div>
                <div class="form-group">
                    <label for="skills">专业技能</label>
                    <input type="text" id="skills" name="skills" placeholder="例如：HTML,CSS,JavaScript,React（用逗号分隔）">
                </div>
                <div class="form-group">
                    <label for="resume-upload">上传简历附件</label>
                    <input type="file" id="resume-upload" name="resume-upload" accept=".pdf,.doc,.docx">
                    <small>支持PDF、Word格式，文件大小不超过5MB</small>
                </div>
                <button type="submit" class="submit-btn">保存信息</button>
            </form>
            <script>
                document.querySelector('#personal-info form').addEventListener('submit', function(e) {
                    e.preventDefault();
                    const now = new Date();
                    const updateTime = now.toLocaleString('zh-CN');
                    
                    const formData = {};
                    const inputs = this.querySelectorAll('input, select, textarea');
                    inputs.forEach(input => {
                        if (input.id) {
                            formData[input.id] = input.value;
                        }
                    });
                    
                    let updates = JSON.parse(localStorage.getItem('resumeUpdates') || '[]');
                    updates.unshift({
                        time: updateTime,
                        data: formData
                    });
                    localStorage.setItem('resumeUpdates', JSON.stringify(updates));
                    
                    alert('保存成功！');
                    showResumeUpdates();
                    showTab('my-resume');
                });

                function showResumeUpdates() {
                    const updates = JSON.parse(localStorage.getItem('resumeUpdates') || '[]');
                    const resumeDisplay = document.getElementById('resume-display');
                    resumeDisplay.innerHTML = '';
                    
                    if (updates.length === 0) {
                        resumeDisplay.innerHTML = '<p>请先保存个人信息以生成简历内容。</p>';
                        return;
                    }
                    
                    updates.forEach(update => {
                        const record = document.createElement('div');
                        record.className = 'update-record';
                        record.textContent = `${update.time} 更新了我的简历`;
                        record.addEventListener('click', function() {
                            const detail = this.nextElementSibling;
                            detail.style.display = detail.style.display === 'none' ? 'block' : 'none';
                        });
                        resumeDisplay.appendChild(record);
                        
                        const detail = document.createElement('div');
                        detail.className = 'update-detail';
                        for (const key in update.data) {
                            const p = document.createElement('p');
                            p.textContent = `${document.querySelector(`label[for="${key}"]`).textContent}: ${update.data[key]}`;
                            detail.appendChild(p);
                        }
                        resumeDisplay.appendChild(detail);
                    });
                }

                // 页面加载时显示更新记录
                window.addEventListener('load', showResumeUpdates);
            </script>
        </div>
        <!-- 职位浏览 tab，确保在 body 内，与其它 tab 并列 -->
        <div id="job-search" class="tab-content">
            <h2>职位浏览</h2>
            <form id="job-search-form" class="filter-group" style="display:flex;flex-wrap:wrap;gap:10px;align-items:center;">
                <input type="text" id="search-keyword" name="keyword" placeholder="关键词/职位名/公司名" style="width:200px;">
                <select id="search-industry" name="industry">
                    <option value="">行业不限</option>
                    <option value="信息技术">信息技术</option>
                    <option value="金融">金融</option>
                    <option value="教育">教育</option>
                    <option value="制造业">制造业</option>
                    <option value="服务业">服务业</option>
                    <option value="医疗">医疗</option>
                    <option value="建筑">建筑</option>
                </select>
                <select id="search-location" name="location">
                    <option value="">地区不限</option>
                    <option value="北京">北京</option>
                    <option value="上海">上海</option>
                    <option value="广州">广州</option>
                    <option value="深圳">深圳</option>
                    <option value="杭州">杭州</option>
                    <option value="成都">成都</option>
                    <option value="武汉">武汉</option>
                </select>
                <select id="search-experience" name="experience">
                    <option value="">经验不限</option>
                    <option value="应届毕业生">应届毕业生</option>
                    <option value="1年以内">1年以内</option>
                    <option value="1-3年">1-3年</option>
                    <option value="3-5年">3-5年</option>
                    <option value="5-10年">5-10年</option>
                    <option value="10年以上">10年以上</option>
                </select>
                <select id="search-education" name="education">
                    <option value="">学历不限</option>
                    <option value="大专">大专</option>
                    <option value="本科">本科</option>
                    <option value="硕士">硕士</option>
                    <option value="博士">博士</option>
                </select>
                <select id="search-salary" name="salaryRange">
                    <option value="">薪资不限</option>
                    <option value="3k-5k">3k-5k</option>
                    <option value="5k-8k">5k-8k</option>
                    <option value="8k-12k">8k-12k</option>
                    <option value="12k-15k">12k-15k</option>
                    <option value="15k-20k">15k-20k</option>
                    <option value="20k+">20k+</option>
                </select>
                <button type="submit" class="submit-btn">搜索</button>
            </form>
            <div id="job-list">
                <table style="width:100%; border-collapse:collapse; background:#fff; margin-top:20px;">
                    <thead style="background:#fafafa;">
                        <tr>
                            <th>职位名</th>
                            <th>岗位类型</th>
                            <th>学历要求</th>
                            <th>工作经验</th>
                            <th>工资</th>
                            <th>工作地区</th>
                            <th>详细地址</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>测试工程师</td>
                            <td>技术·测试</td>
                            <td>本科</td>
                            <td>在校生</td>
                            <td>50K-71K</td>
                            <td>北京市·北京市</td>
                            <td>海淀区钻石大厦</td>
                            <td>
                                <button class="submit-btn" style="background:#3498db;">查看详情</button>
                                <button class="submit-btn" style="background:#27ae60;">提交简历</button>
                            </td>
                        </tr>
                        <tr>
                            <td>算法工程师</td>
                            <td>技术·算法</td>
                            <td>博士</td>
                            <td>应届生</td>
                            <td>12K-20K</td>
                            <td>四川省·成都市</td>
                            <td>武侯区东方希望大厦</td>
                            <td>
                                <button class="submit-btn" style="background:#3498db;">查看详情</button>
                                <button class="submit-btn" style="background:#27ae60;">提交简历</button>
                            </td>
                        </tr>
                        <tr>
                            <td>java实习开发工程师</td>
                            <td>技术·后端</td>
                            <td>本科</td>
                            <td>在校生</td>
                            <td>5K-10K</td>
                            <td>广东省·深圳市</td>
                            <td>南山区 腾讯大厦</td>
                            <td>
                                <button class="submit-btn" style="background:#3498db;">查看详情</button>
                                <button class="submit-btn" style="background:#27ae60;">提交简历</button>
                            </td>
                        </tr>
                        <tr>
                            <td>java初级开发工程师</td>
                            <td>技术·后端</td>
                            <td>本科</td>
                            <td>一年以上</td>
                            <td>12K-20K</td>
                            <td>广东省·深圳市</td>
                            <td>南山区 腾讯大厦</td>
                            <td>
                                <button class="submit-btn" style="background:#3498db;">查看详情</button>
                                <button class="submit-btn" style="background:#27ae60;">提交简历</button>
                            </td>
                        </tr>
                        <tr>
                            <td>产品经理</td>
                            <td>产品·产品经理</td>
                            <td>本科</td>
                            <td>一年以上</td>
                            <td>50K-72K</td>
                            <td>北京市·北京市</td>
                            <td>海淀区华为大厦</td>
                            <td>
                                <button class="submit-btn" style="background:#3498db;">查看详情</button>
                                <button class="submit-btn" style="background:#27ae60;">提交简历</button>
                            </td>
                        </tr>
                        <tr>
                            <td>java高级开发工程师</td>
                            <td>技术·后端</td>
                            <td>本科</td>
                            <td>一年以上</td>
                            <td>12K-19K</td>
                            <td>北京市·北京市</td>
                            <td>北京市海淀区百度大厦</td>
                            <td>
                                <button class="submit-btn" style="background:#3498db;">查看详情</button>
                                <button class="submit-btn" style="background:#27ae60;">提交简历</button>
                            </td>
                        </tr>
                        <tr>
                            <td>算法工程师</td>
                            <td>技术·算法</td>
                            <td>博士</td>
                            <td>五年以上</td>
                            <td>50K-71K</td>
                            <td>广东省·深圳市</td>
                            <td>南山区 永新汇1号楼</td>
                            <td>
                                <button class="submit-btn" style="background:#3498db;">查看详情</button>
                                <button class="submit-btn" style="background:#27ae60;">提交简历</button>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

        <!-- 投递记录/进度查询 -->
        <div id="application-record" class="tab-content">
            <h2>投递记录/进度查询</h2>
    <div class="application-progress-list">
        <!-- 单条进度卡片 -->
        <div class="application-progress-card">
            <div class="apc-header">
                <span class="apc-title">笔记运营实习生</span>
                <span class="apc-status apc-status-fail">流程结束</span>
                <span class="apc-result">应聘状态：筛选不通过</span>
            </div>
            <div class="apc-info">
                实习 / 运营 / 音乐事业部 / 2025-04-15 投递
            </div>
            <div class="apc-steps">
                <div class="apc-step apc-step-active">
                    <div class="apc-dot apc-dot-fail"></div>
                    <div class="apc-step-label">筛选不通过<br><span class="apc-date">2025-04-15</span></div>
                </div>
                <div class="apc-step"><div class="apc-dot"></div><div class="apc-step-label">评估</div></div>
                <div class="apc-step"><div class="apc-dot"></div><div class="apc-step-label">面试</div></div>
                <div class="apc-step"><div class="apc-dot"></div><div class="apc-step-label">Offer</div></div>
                <div class="apc-step"><div class="apc-dot"></div><div class="apc-step-label">入职</div></div>
            </div>
        </div>
        <!-- 可复制多条 -->
        <div class="application-progress-card">
            <div class="apc-header">
                <span class="apc-title">内容运营实习生</span>
                <span class="apc-status apc-status-fail">流程结束</span>
                <span class="apc-result">应聘状态：筛选不通过</span>
            </div>
            <div class="apc-info">
                实习 / 运营 / 音乐事业部 / 2025-04-15 投递
            </div>
            <div class="apc-steps">
                <div class="apc-step apc-step-active">
                    <div class="apc-dot apc-dot-fail"></div>
                    <div class="apc-step-label">筛选不通过<br><span class="apc-date">2025-04-15</span></div>
                </div>
                <div class="apc-step"><div class="apc-dot"></div><div class="apc-step-label">评估</div></div>
                <div class="apc-step"><div class="apc-dot"></div><div class="apc-step-label">面试</div></div>
                <div class="apc-step"><div class="apc-dot"></div><div class="apc-step-label">Offer</div></div>
                <div class="apc-step"><div class="apc-dot"></div><div class="apc-step-label">入职</div></div>
            </div>
        </div>
        <!-- 继续添加更多卡片... -->
    </div>
        </div>

<style>
.application-progress-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.application-progress-card {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px #f0f1f2;
    padding: 20px 24px;
}
.apc-header {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 18px;
    margin-bottom: 8px;
}
.apc-title {
    font-weight: bold;
    color: #222;
}
.apc-status {
    font-size: 14px;
    padding: 2px 10px;
    border-radius: 12px;
    background: #e6f7ff;
    color: #1890ff;
    margin-left: 8px;
}
.apc-status-fail {
    background: #fff1f0;
    color: #ff4d4f;
}
.apc-result {
    margin-left: auto;
    font-size: 14px;
    color: #888;
}
.apc-info {
    color: #666;
    font-size: 14px;
    margin-bottom: 18px;
}
.apc-steps {
    display: flex;
    align-items: center;
    gap: 0;
    margin-top: 8px;
}
.apc-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    position: relative;
}
.apc-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #e4e4e4;
    margin-bottom: 4px;
    border: 2px solid #e4e4e4;
}
.apc-step-active .apc-dot {
    background: #ff4d4f;
    border-color: #ff4d4f;
}
.apc-dot-fail {
    background: #ff4d4f;
    border-color: #ff4d4f;
}
.apc-step-label {
    font-size: 13px;
    color: #888;
    text-align: center;
    min-width: 40px;
}
.apc-step-active .apc-step-label {
    color: #ff4d4f;
    font-weight: bold;
}
.apc-date {
    font-size: 12px;
    color: #bbb;
}
.apc-step:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 6px;
    right: -50%;
    width: 100%;
    height: 2px;
    background: #e4e4e4;
    z-index: 0;
}
</style>
        <!-- 面试通知-->
        <div id="interview-notice" class="tab-content">
            <div class="header-section" style="margin-bottom: 30px; border-bottom: 1px solid #eee; padding-bottom: 20px;">
                <div class="company-brand" style="display: flex; align-items: center; margin-bottom: 20px;">
                    <img src="" style="width: 60px; height: 60px; border-radius: 50%; margin-right: 15px;">
                    <div>
                        <div id="companyName" style="font-size: 18px; font-weight: bold;">科技有限公司</div>
                        <div style="color: #666; font-size: 14px;">专业的人才招聘平台</div>
                    </div>
                </div>
                <h2 style="text-align: center; font-size: 24px; margin: 20px 0;">面试通知 - <span id="jobTitle" style="font-weight: bold;">[具体岗位名称]</span></h2>
                <div class="notice-meta" style="display: flex; justify-content: space-between; color: #666; margin-bottom: 10px;">
                    <div>候选人姓名：<span id="candidateName" style="font-weight: 500;">季</span></div>
                    <div>通知发出时间：2025-3-14<span id="noticeTime" style="font-weight: 500;"></span></div>
                </div>
            </div>

            <!-- 核心内容区 -->
            <div class="content-section">
                <!-- 面试基础信息模块 -->
                <div class="info-card" style="border: 1px solid #eee; border-radius: 8px; padding: 20px; margin-bottom: 25px; box-shadow: 0 2px 4px rgba(0,0,0,0.05);">
                    <h3 style="font-size: 18px; margin-bottom: 15px; color: #2c3e50; border-left: 3px solid #2c3e50; padding-left: 10px;">面试基础信息</h3>
                    <div class="info-grid" style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px;">
                        <div>
                            <p style="margin: 8px 0;"><span style="color: #666; display: inline-block; width: 100px;">岗位名称：</span><span id="positionName" style="font-weight: bold;">高级工程师</span></p>
                            <p style="margin: 8px 0;"><span style="color: #666; display: inline-block; width: 100px;">面试类型：</span><span id="interviewType" style="font-weight: 500;">初试</span></p>
                            <div style="margin: 8px 0;">
                                <span style="color: #666; display: inline-block; width: 100px;">面试时间：</span>
                                <div>
                                    <p>日期：<span id="interviewDate">2025-4-10</span></p>
                                    <p>时间：<span id="interviewTime">16:00-18:00</span></p>
                                    <p id="timezoneNote" style="font-size: 12px; color: #666; margin-top: 4px;">（如涉及跨时区候选人）</p>
                                </div>
                            </div>
                        </div>
                        <div>
                            <div style="margin: 8px 0;">
                                <span style="color: #666; display: inline-block; width: 100px;">面试地点：</span>
                                <div id="locationContainer">
                                    <div id="offlineLocation" style="display: block;">
                                        <p>北京**区</p>
                                        <button type="button" class="btn" style="margin-top: 5px; padding: 4px 10px; font-size: 12px;" onclick="showMap()">地图导航</button>
                                    </div>
                                    <div id="onlineLocation" style="display: none;">
                                        <p>视频会议平台：<span id="meetingPlatform">腾讯会议</span></p>
                                        <p>会议ID/链接：<span id="meetingId">111**233</span></p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 面试流程与注意事项模块 -->
                <div class="info-card" style="border: 1px solid #eee; border-radius: 8px; padding: 20px; margin-bottom: 25px; box-shadow: 0 2px 4px rgba(0,0,0,0.05);">
                    <h3 style="font-size: 18px; margin-bottom: 15px; color: #2c3e50; border-left: 3px solid #2c3e50; padding-left: 10px;">面试流程与注意事项</h3>
                    <div style="margin-bottom: 20px;">
                        <h4 style="font-size: 16px; margin-bottom: 10px;">面试环节</h4>
                        <ul id="interviewProcess" style="padding-left: 20px; line-height: 1.6;">
                            <li>10:00-10:30 人力资源部初面</li>
                            <li>10:40-11:30 部门主管复试</li>
                        </ul>
                    </div>
                    <div style="margin-bottom: 20px;">
                        <h4 style="font-size: 16px; margin-bottom: 10px;">携带材料</h4>
                        <ul id="requiredDocuments" style="padding-left: 20px; line-height: 1.6;">
                            <li>身份证原件及复印件</li>
                            <li>学历/资格证书原件</li>
                            <li>作品集（如岗位需要）</li>
                        </ul>
                    </div>
                    <div>
                        <h4 style="font-size: 16px; margin-bottom: 10px;">注意事项</h4>
                        <ul id="notes" style="padding-left: 20px; line-height: 1.6;">
                            <li>提前10分钟到达/上线准备</li>
                            <li>着装建议：商务正装/休闲职业装</li>
                            <li>联系方式备用：HR联系人及电话</li>
                        </ul>
                    </div>
                </div>

                <!-- 候选人操作区 -->
                <div class="action-card" style="border: 1px solid #eee; border-radius: 8px; padding: 20px; margin-bottom: 25px; background-color: #f9f9f9;">
                    <div style="display: flex; gap: 15px; margin-bottom: 15px; flex-wrap: wrap;">
                        <button id="confirmBtn" class="btn submit-btn" style="padding: 10px 20px; font-size: 16px; background-color: #2c3e50; color: white; border: none; border-radius: 4px; cursor: pointer;">✅ 确认参加面试</button>
                        <button id="cancelBtn" class="btn" style="padding: 10px 20px; font-size: 16px; background-color: #e74c3c; color: white; border: none; border-radius: 4px; cursor: pointer;">❌ 取消面试</button>
                        <button id="rescheduleBtn" class="btn" style="padding: 10px 20px; font-size: 16px; background-color: #3498db; color: white; border: none; border-radius: 4px; cursor: pointer;">⏰ 申请改期</button>
                    </div>
                    <div style="color: #e74c3c; font-weight: 500;">
                        操作时效提示：请于 2025 年 07 月 07 日 18:00 前完成确认
                    </div>
                </div>

                <!-- 辅助信息区 -->
                <div class="info-card" style="border: 1px solid #eee; border-radius: 8px; padding: 20px; margin-bottom: 25px; box-shadow: 0 2px 4px rgba(0,0,0,0.05);">
                    <h3 style="font-size: 18px; margin-bottom: 15px; color: #2c3e50; border-left: 3px solid #2c3e50; padding-left: 10px;">HR 联系方式</h3>
                    <div style="margin-bottom: 20px;">
                        <p style="margin: 8px 0;"><span style="color: #666; display: inline-block; width: 100px;">联系人姓名：</span><span id="hrName" style="font-weight: 500;">[HR 姓名]</span></p>
                        <p style="margin: 8px 0;"><span style="color: #666; display: inline-block; width: 100px;">联系电话：</span><span id="hrPhone" style="font-weight: 500;">[电话号码]</span></p>
                        <p style="margin: 8px 0;"><span style="color: #666; display: inline-block; width: 100px;">电子邮箱：</span><span id="hrEmail" style="font-weight: 500;">[邮箱地址]</span></p>
                        <p style="margin: 8px 0;"><span style="color: #666; display: inline-block; width: 100px;">工作时间：</span><span id="workHours" style="font-weight: 500;">周一至周五 9:00-18:00</span></p>
                    </div>

                    <h3 style="font-size: 18px; margin-bottom: 15px; color: #2c3e50; border-left: 3px solid #2c3e50; padding-left: 10px;">常见问题 FAQ</h3>
                    <div class="faq-container">
                        <div class="faq-item" style="margin-bottom: 10px; border-bottom: 1px solid #eee; padding-bottom: 10px;">
                            <div class="faq-question" style="font-weight: 500; cursor: pointer; display: flex; justify-content: space-between; align-items: center;">
                                Q：面试迟到如何处理？
                                <span class="faq-toggle">+</span>
                            </div>
                            <div class="faq-answer" style="display: none; padding-top: 10px; color: #666;">
                                A：请提前 30 分钟联系 HR 说明情况，我们将视情况调整面试安排。如未提前通知且迟到超过 15 分钟，可能会影响您的面试评估。
                            </div>
                        </div>
                        <div class="faq-item" style="margin-bottom: 10px; border-bottom: 1px solid #eee; padding-bottom: 10px;">
                            <div class="faq-question" style="font-weight: 500; cursor: pointer; display: flex; justify-content: space-between; align-items: center;">
                                Q：线上面试需要什么设备？
                                <span class="faq-toggle">+</span>
                            </div>
                            <div class="faq-answer" style="display: none; padding-top: 10px; color: #666;">
                                A：建议使用电脑 + 摄像头，确保网络带宽≥10M，提前 15 分钟测试设备和网络连接。面试前请关闭无关应用程序，确保面试环境安静。
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 我的简历 -->
        <div id="my-resume" class="tab-content">
            <h2>我的简历</h2>
            <div id="resume-display">
                <p>请先保存个人信息以生成简历内容。</p>
            </div>
        </div>
        
        <script>
            function showTab(tabId) {
                const tabs = document.querySelectorAll('.tab-content');
                tabs.forEach(tab => {
                    tab.classList.remove('active');
                });
                const targetTab = document.getElementById(tabId);
                targetTab.classList.add('active');
            }
        </script>
    <script type="module">
        import { protectRoute } from './js/auth.js';
        // 仅允许求职者角色访问
        protectRoute(['seeker']);
    </script>
    <script src="js/job-search.js"></script>
    <script src="js/resume.js"></script>
    <!-- 注释掉与职位搜索相关的JS逻辑，保留静态表格 -->
    <script>
    // document.addEventListener('DOMContentLoaded', function() {
    //     // 初始化职位搜索功能
    //     const form = document.getElementById('job-search-form');
    //     const jobList = document.getElementById('job-list');
    //     if (form && jobList) {
    //         form.addEventListener('submit', async function(e) {
    //             e.preventDefault();
    //             const formData = new FormData(form);
    //             const params = {};
    //             for (const [key, value] of formData.entries()) {
    //                 if (value) params[key] = value;
    //             }
    //             jobList.innerHTML = '<div style="padding:20px;">加载中...</div>';
    //             try {
    //                 const data = await window.getJobList ? window.getJobList(params) : [];
    //                 window.renderJobList ? window.renderJobList(data.jobs || [], 'job-list') : (jobList.innerHTML = '未找到职位');
    //             } catch (err) {
    //                 jobList.innerHTML = '<div style="color:red;">查询失败</div>';
    //             }
    //         });
    //         // 页面加载时自动触发一次查询，显示全部职位
    //         form.dispatchEvent(new Event('submit'));
    //     }
    // });
    </script>
</body>
</html>
